<template>
  <div class="mod-config paper-box">
    <div class="paper-left">
      <paper-cate
        ref="paperCate"
        rootName="试卷分类管理"
        :setCurrent="setCurrent"
        :current="current"
        :url="{
              cateType: 1,
              update:'/exam-admin/paper/cate/update',
              save:'/exam-admin/paper/cate/save',
              delete:'/exam-admin/paper/cate/delete',
              tree:'/exam-admin/paper/cate/tree'
        }"
      />
    </div>
    <div class="paper-right" ref="fixedMain">
      <el-row ref="fixedForm">
        <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList(1)">
          <el-col :span="20">
            <el-form-item>
              <el-input
                v-model="dataForm.paperName"
                placeholder="试卷名称"
                clearable
                @change="getDataList(1)"
                @clear="getDataList(1)"
              />
            </el-form-item>
            <el-form-item>
              <el-button @click="getDataList(1)">查询</el-button>
              <el-button
                v-if="isAuth('paper:paper:save') && type !== 'list'"
                type="primary"
                @click="addHandle()"
              >新增</el-button>
            </el-form-item>
          </el-col>
          <el-col :span="4" class="learn-drawer-range-box-buttons" v-if="type === 'list'">
            <el-button
              class="el-icon-check"
              type="text"
              @click="setExam"
              style="color: #67C23A;font-size:24px"
            />
            <el-button
              class="el-icon-close"
              type="text"
              @click="handleClose"
              style="color: #F56C6C;font-size: 24px"
            />
          </el-col>
        </el-form>
      </el-row>
      <el-table
        :data="dataList"
        width="100%"
        :highlight-current-row="type === 'list'"
        @current-change="setExamRow"
        border
        style="width: 100%;"
        v-loading="dataListLoading"
      >
        <el-table-column
          fixed="left"
          prop="ID"
          type="index"
          header-align="center"
          align="center"
          width="80"
          label="ID"
        ></el-table-column>
        <el-table-column prop="paperName" header-align="center" align="center" label="名称"></el-table-column>
        <el-table-column prop="cateName" header-align="center" align="center" label="分类"></el-table-column>
        <el-table-column prop="paperName" header-align="center" align="center" label="组卷方式">
          <template slot-scope="scope">
            {{parseInt(scope.row.compType) === 0 ? '选题':parseInt(scope.row.compType) === 1 ?
            '抽题':'随机'}}
          </template>
        </el-table-column>
        <el-table-column prop="totalper" header-align="center" align="center" label="总分"></el-table-column>
        <el-table-column
          v-if="type !== 'list'"
          fixed="right"
          header-align="center"
          align="center"
          width="150"
          label="操作"
        >
          <template slot-scope="scope">
            <el-button type="text" v-if="scope.row.compType === 0" @click="viewPaper(scope.row.id)">查看</el-button>
            <el-button type="text" @click="addHandle(scope.row.id)">修改</el-button>
            <el-button type="text" @click="deleteHandle(scope.row.id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        ref="fixedPag"
        @size-change="sizeChangeHandle"
        @current-change="currentChangeHandle"
        :current-page="pageIndex"
        :page-sizes="[10, 20, 50]"
        :page-size="pageSize"
        :total="totalPage"
        layout="total, sizes, prev, pager, next, jumper"
      ></el-pagination>
      <add-exam
        ref="addExam"
        v-if="addOrUpdateVisible && type !== 'list'"
        :getDataList="getDataList"
      />
<!--      @refreshDataList="getList"-->
      <paper-view ref="paperView" ></paper-view>
    </div>
  </div>
</template>

<script>
// import AddOrUpdate from './paper-add-or-update'
import paperView from './paper-view'
import paperCate from './papercate'
import AddExam from '../../../components/check/addExam'

export default {
  data() {
    return {
      current: {},
      paperCate: false,
      dataForm: {
        paperName: '',
        cateId: ''
      },
      dataList: [],
      pageIndex: 1,
      pageSize: 10,
      totalPage: 0,
      dataListLoading: false,
      // dataListSelections: [],
      addOrUpdateVisible: false,
      AddExam: false
    }
  },
  props: {
    type: String,
    setExamRow: {
      type: Function,
      default: function() {
        return _ => ({})
      }
    },
    handleClose: {
      type: Function,
      default: function() {
        return _ => ({})
      }
    },
    setExam: {
      type: Function,
      default: function() {
        return _ => ({})
      }
    }
  },
  components: {
    AddExam,
    // AddOrUpdate,
    paperCate,
    paperView
  },
  mounted() {
    this.$refs.paperCate.init()
    this.getDataList()
  },
  methods: {
    delectCate() {
      this.current = { name: '', id: '' }
      this.dataForm.cateId = ''
      this.getDataList()
    },
    setCurrent(data, bool) {
      this.current = data
      this.dataForm.cateId = data.id
      this.getDataList(1)
    },
    viewPaper(id) {
      this.$nextTick(_ => {
        this.$refs.paperView.init(id)
      })
    },
    // checkSort () {
    //   this.dialogFormVisible = true
    //   this.paperCate = true
    //   this.$nextTick(() => {
    //     this.$refs.paperCate.init()
    //   })
    // },
    // 获取数据列表
    getDataList(page) {
      if (page) this.pageIndex = page
      this.dataListLoading = true
      this.$http({
        url: this.$http.adornUrl('/exam-admin/paper/list'),
        method: 'post',
        data: {
          page: this.pageIndex,
          limit: this.pageSize,
          paperName: this.dataForm.paperName,
          cateId: this.dataForm.cateId
        }
      }).then(data => {
        if (data && data.code === 200) {
          this.dataList = data.data.list
          this.totalPage = data.data.totalCount
        } else {
          this.dataList = []
          this.totalPage = 0
        }
        this.dataListLoading = false
      })
    },
    // 每页数
    sizeChangeHandle(val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDataList()
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageIndex = val
      this.getDataList()
    },
    // 多选
    /* selectionChangeHandle (val) {
        this.dataListSelections = val
      }, */
    // 新增 / 修改
    addHandle(id) {
      this.addOrUpdateVisible = true
      this.$nextTick(() => {
        this.$refs.addExam.init(id)
      })
    },
    // sort () {
    //   this.paperCate = true
    //   this.dialogFormVisible = true
    //   this.$nextTick(() => {
    //     this.$refs.paperCate.init(false)
    //   })
    // },
    // 删除
    deleteHandle(id) {
      this.$confirm(`确定要进行删除操作吗?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$http({
          url: this.$http.adornUrl('/exam-admin/paper/delete'),
          method: 'post',
          data: { id: id }
        }).then(data => {
          if (data && data.code === 200) {
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500
            })
            this.pageIndex > 1 && this.dataList.length <= 1 && this.pageIndex --
            this.getDataList()
          } else {
            this.$message.warning(data.msg)
          }
        })
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.paper-box {
  min-height: 100%;
  height: 100%;
  display: flex;
  overflow: auto;
  border: 1px solid #eee;

  .paper-left {
    padding-right: 10px;
  }

  .paper-right {
    flex: 1;
    padding: 10px;
    overflow: auto;
  }
}
</style>
